import { computed, ref } from 'vue';

import { defineStore } from 'pinia';

interface MqttType {
  deviceId: string | undefined;
  deviceSn: string;
  productId: string | undefined;
  productKey: string;
}
interface TableType {
  time: string;
  type: string;
  content: string;
}
export const useMqttStore = defineStore('mqtt-store', () => {
  const mqttState = ref(false);
  const mqttOption = ref<MqttType>({
    deviceId: undefined,
    deviceSn: '',
    productId: undefined,
    productKey: '',
  });
  const mqttTable = ref<TableType[]>([]);
  function setMqttOption(option: MqttType) {
    mqttOption.value = option;
  }
  // 上报主题
  const upTheme = computed(() => {
    return `$SYS/${mqttOption.value.productKey}/${mqttOption.value.deviceSn}/thing/property/post`;
  });
  // 下行主题
  const downTheme = computed(() => {
    return `$SYS/${mqttOption.value.productKey}/${mqttOption.value.deviceSn}/thing/property/set`;
  });

  // MQTT操作列表
  function setMqttTable(option: TableType) {
    mqttTable.value.push(option);
  }
  function $reset() {
    setMqttOption({
      deviceId: undefined,
      deviceSn: '',
      productId: undefined,
      productKey: '',
    });
    mqttTable.value = [];
  }

  return {
    $reset,
    mqttState,
    upTheme,
    mqttTable,
    mqttOption,
    setMqttTable,
    downTheme,
    setMqttOption,
  };
});
